<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改考勤信息')"/>
    <th:block th:include="include :: datetimepicker-css"/>
    <th:block th:include="include :: select2-css"/>
    <th:block th:include="include :: bootstrap-select-css"/>
</head>
<style>
    input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

    input[type="number"] {
        -moz-appearance: textfield;
    }

</style>
<body>
<div class="wrapper wrapper-content animated fadeInRight ibox-content" id="dv">
    <form class="form-horizontal m" id="form-attendance-edit" AUTOCOMPLETE="OFF">
        <input th:value="${data.id}" id="id" name="id" class="form-control" type="hidden"/>
        <h4 class="form-header h4">基本信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">单位：</label>
                    <div class="col-sm-8">
                        <select name="compId" id="compId" class="form-control noselect2">
                            <option value="">请选择</option>
                            <option th:each="pro:${userComp}" th:value="${pro.compId}"
                                    th:text="${pro.compName}"
                                    th:selected="${data.compId==pro.compId}"
                            ></option>

                        </select>
                    </div>

                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">年份：</label>
                    <div class="col-sm-8">
                        <select name="years" id="years" class="form-control noselect2">
                            <option value="">请选择</option>
                            <option th:selected="${data.years==2020}" value="2020">2020</option>
                            <option th:selected="${data.years==2021}" value="2021">2021</option>
                            <option th:selected="${data.years==2022}" value="2022">2022</option>
                            <option th:selected="${data.years==2023}" value="2023">2023</option>
                            <option th:selected="${data.years==2024}" value="2024">2024</option>
                            <option th:selected="${data.years==2025}" value="2025">2025</option>
                        </select>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">月份：</label>
                    <div class="col-sm-8">
                        <select name="months" id="months" class="form-control noselect2">
                            <option value="">请选择</option>
                            <option th:selected="${data.months==1}" value="1">一月</option>
                            <option th:selected="${data.months==2}" value="2">二月</option>
                            <option th:selected="${data.months==3}" value="3">三月</option>
                            <option th:selected="${data.months==4}" value="4">四月</option>
                            <option th:selected="${data.months==5}" value="5">五月</option>
                            <option th:selected="${data.months==6}" value="6">六月</option>
                            <option th:selected="${data.months==7}" value="7">七月</option>
                            <option th:selected="${data.months==8}" value="8">八月</option>
                            <option th:selected="${data.months==9}" value="9">九月</option>
                            <option th:selected="${data.months==10}" value="10">十月</option>
                            <option th:selected="${data.months==11}" value="11">十一月</option>
                            <option th:selected="${data.months==12}" value="12">十二月</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">迟到信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">迟到人数：</label>
                    <div class="col-sm-8">
                        <input id="lateNum" name="lateNum" th:value="${data.lateNum}" class="form-control" type="number"
                               placeholder="请输入迟到人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">迟到时数：</label>
                    <div class="col-sm-8">
                        <input id="lateHours" name="lateHours" th:value="${data.lateHours}" class="form-control" type="number" placeholder="请输入迟到时数"
                               required />
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">早退信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">早退人数：</label>
                    <div class="col-sm-8">
                        <input id="leaveNum" name="leaveNum" class="form-control" th:value="${data.leaveNum}" type="number"
                               placeholder="请输入早退人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">早退时数：</label>
                    <div class="col-sm-8">
                        <input id="leaveHours" name="leaveHours" th:value="${data.leaveHours}" class="form-control" type="number" placeholder="请输入早退时数"
                               required />
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">旷工信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">旷工人数：</label>
                    <div class="col-sm-8">
                        <input id="absenteeismNum" name="absenteeismNum" th:value="${data.absenteeismNum}"  class="form-control" type="number"
                               placeholder="请输入旷工人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">旷工时数：</label>
                    <div class="col-sm-8">
                        <input id="absenteeismHours" name="absenteeismHours" th:value="${data.absenteeismHours}" class="form-control" type="number" placeholder="请输入旷工时数"
                               required />
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">事假信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">事假人数：</label>
                    <div class="col-sm-8">
                        <input id="compassionateNum" name="compassionateNum" th:value="${data.compassionateNum}" class="form-control" type="number"
                               placeholder="请输入事假人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">事假时数：</label>
                    <div class="col-sm-8">
                        <input id="compassionateHours" name="compassionateHours" th:value="${data.compassionateHours}" class="form-control" type="number" placeholder="请输入事假时数"
                               required />
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">病假信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">病假人数：</label>
                    <div class="col-sm-8">
                        <input id="sickNum" name="sickNum" th:value="${data.sickNum}" class="form-control" type="number"
                               placeholder="请输入病假人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">病假时数：</label>
                    <div class="col-sm-8">
                        <input id="sickHours" name="sickHours" th:value="${data.sickHours}" class="form-control" type="number" placeholder="请输入病假时数"
                               required />
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">婚假信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">婚假人数：</label>
                    <div class="col-sm-8">
                        <input id="marriageNum" name="marriageNum" th:value="${data.marriageNum}" class="form-control" type="number"
                               placeholder="请输入婚假人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">婚假时数：</label>
                    <div class="col-sm-8">
                        <input id="marriageHours" name="marriageHours" th:value="${data.marriageHours}" class="form-control" type="number" placeholder="请输入婚假时数"
                               required />
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">丧假信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">丧假人数：</label>
                    <div class="col-sm-8">
                        <input id="mourningNum" name="mourningNum" th:value="${data.mourningNum}" class="form-control" type="number"
                               placeholder="请输入丧假人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">丧假时数：</label>
                    <div class="col-sm-8">
                        <input id="mourningHours" name="mourningHours" th:value="${data.mourningHours}" class="form-control" type="number" placeholder="请输入丧假时数"
                               required />
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">产假信息</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">产假人数：</label>
                    <div class="col-sm-8">
                        <input id="yieldNum" name="yieldNum" th:value="${data.yieldNum}" class="form-control" type="number"
                               placeholder="请输入产假人数" required />
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">产假时数：</label>
                    <div class="col-sm-8">
                        <input id="yieldHours" name="yieldHours" th:value="${data.yieldHours}" class="form-control" type="number" placeholder="请输入产假时数"
                               required />
                    </div>
                </div>
            </div>
        </div>


    </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: datetimepicker-js"/>
<th:block th:include="include :: select2-js"/>

<script type="text/javascript">
    var prefix = ctx + 'attendance';

    $(function () {



    })


    function submitHandler() {
        if ($.validate.form()) {
            var data = $("#form-attendance-edit").serializeArray();
            $.operate.save(prefix + "/edit", data);
            //parent.sum();
        }
    }

    function getRecruitReach(){
        var demandNum = $("#demandNum").val();
        var actualArrivalNum = $("#actualArrivalNum").val();

        if(demandNum != '' && actualArrivalNum != ''){
            var recruitReach = (actualArrivalNum / demandNum * 100).toFixed(2);
            $("#recruitReach").val(recruitReach + "%");

        }
    }
</script>

</body>
</html>